<template>
	<div class="app-container">
		<div class="content">
			<div class="navnum">
				<el-steps :active="1" finish-status="end" process-status='curt' class="nextnav"  simple>
				  <el-step title="导入文件" icon="iconfont icon-1" ></el-step>
				  <el-step title="保单校验" icon="iconfont icon-2"></el-step>
				  <el-step title="结算完成" icon="iconfont icon-3"></el-step>
				</el-steps>
				<div class="list-tab">
		          <div class="tab now">上游保单结算</div>
		          <div class="tab" @click="gopidan">上游批单结算</div>
		   </div>
			</div>
			
			<!--form-->
			<el-form label-width="100px" class="upsettle-form1 demo-ruleForm" :rules="rules" :model="formLabel"  ref="formLabel">
				<div class="form_top">
				<el-form-item label="保险公司：" class="is-required" prop="insuranceId">
					<div class="input_wp">
						<el-select class="wd300" size="mini" v-model="formLabel.insuranceId" placeholder="请选择结算公司" @change="changeIns" >
							<el-option-group v-for="group in companies" :key="group.letter" :label="group.letter">
								<el-option v-for="item in group.insurances" :key="item.id" :label="item.insuranceName" :value="item.id">
								</el-option>
							</el-option-group>
						</el-select>

						<!-- <a style="color:#027dca;"></a> -->

						
					</div>
					<div class="demowp">
		       			<p class="modeP hei28" v-if="mubanLen==0"><a class="acolor" @click="demoedit">配置模板</a>&nbsp;&nbsp;<el-tooltip class="item title ddd" effect="light" content="模板配置后，可以直接识别保险公司所给的表格数据，提高工作效率!" placement="bottom">
					      <i class="el-icon-warning iconColor cursor"></i>
					    </el-tooltip></p>
		       			<p class="modeP hei28" v-if="mubanLen>0">已有模板，重新<a class="acolor" @click="demoedit">配置模板</a>&nbsp;&nbsp;<el-tooltip class="item title ddd" effect="dark" content="模板配置后，可以直接识别保险公司所给的表格数据，提高工作效率!" placement="bottom">
					      <i class="el-icon-warning iconColor cursor"></i>
					    </el-tooltip></p>
		       		</div>
		           
		      	</el-form-item>
		      	<!--配置模板-->
		       	
		       	
		       		
		       
		        <!--结算周期-->
		       	<el-form-item label="结算周期："  class="is-required" prop="value">
		       		<div class="input_wp">
		       			
		       			<el-date-picker class="wd300" size='mini' format='yyyy-MM-dd' value-format='yyyy-MM-dd' v-model="formLabel.value" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"  :picker-options="pickerOptions" ></el-date-picker>
		       		<span v-if="tipsshow" class="timetips">  (以{{timetype}}进行结算)</span>
					   </div>
					   
		       		<div style="display: none;"><el-input type="hidden" v-model="formLabel.value"></el-input></div>
		       	</el-form-item>
		       	<!--结算备注-->
		       	<el-form-item label="结算备注：" prop="reamrak">
		       		<div class="input_wp">
		       			<el-input
		       			  class="wd300 font13"
						  type="textarea"
						  :rows="3"
						  placeholder="请输入内容"
						  v-model="formLabel.reamrak">
						</el-input>
		       		</div>
		       	</el-form-item>		       	
		       	<!--导入文件-->
		       	<el-form-item label="导入文件：" class="is-required " prop="filePath">
		       		<div class="input_wp">
		       			<el-input
		       			  class="wd300"
						  type="hidden"
						  v-model="formLabel.filePath" style="display: none;">
						</el-input>
		       			<el-upload class="upload-demo"
		       				ref="uploadexcel"
		       				 :action="action" 
		       				 :headers="headers"
		       				 :auto-upload='true' :on-success="loadSuc" :on-error='error'  :on-remove="handleRemove"  multiple :limit="1" :on-exceed="handleExceed" :file-list="fileList" :before-upload="beforeAvatarUpload" accept="excel/xls,excel/xlsx" :disabled="upbtndisabled">
  							<el-button size="mini" :on-error='error' class="floatLeft" :disabled="upbtndisabled">
	                    		<i class='el-icon-upload2'></i> 上传文件
	                  		</el-button>
	                  		<div slot="tip" class="el-upload__tip uploadTxt">支持格式：xlsx、xls</div>
						</el-upload>
		       		</div>
		       	</el-form-item>
		       	</div>
		       	
		       	<!--预览表格-->
		       	<div class="tableDiv_upset1" v-show="lookedTableShow">
		       		<p class="fileV">预览：<span class="fileName">{{excelName}}</span> &nbsp;<span class="fileVerify">请查看下表，确保模板配置各列是正确的</span></p>
		       		<template>
					    <el-table :data="tableData" style="width: 100%" class="sysTable">
					      <el-table-column prop="" label="保单号" width="200"></el-table-column>		      
					      <el-table-column prop="" label="保单手续费比例" ></el-table-column>
					      <el-table-column prop="" label="保单手续费" ></el-table-column>
					      <el-table-column prop="" label="车船税佣金比例" ></el-table-column>
					      <el-table-column prop="" label="车船税佣金" ></el-table-column>
					      <el-table-column prop="" label="奖励比例" ></el-table-column>
					      <el-table-column prop="" label="奖励金额" ></el-table-column>					      
					    </el-table>
					</template>
			       	<template v-if="isshow">
					    <el-table :data="tableData" style="width: 100%" class="lookedTable" stripe>
					      <el-table-column
					        prop="guaranteeSlipNumber"
					       :label="tablenav[0]"
					        width="200">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.guaranteeSlipNumber">{{scope.row.guaranteeSlipNumber}}</p>
					        	<p v-if="!scope.row.guaranteeSlipNumber">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="poundageRatio"
					        :label="tablenav[1]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.poundageRatio">{{scope.row.poundageRatio | numFilter}}%</p>
					        	<p v-if="!scope.row.poundageRatio">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="poundage"
					        :label="tablenav[2]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.poundage">{{scope.row.poundage}}</p>
					        	<p v-if="!scope.row.poundage">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="vehicleAndVesselTaxRatio"
					        :label="tablenav[3]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.vehicleAndVesselTaxRatio">{{scope.row.vehicleAndVesselTaxRatio | numFilter}}%</p>
					        	<p v-if="!scope.row.vehicleAndVesselTaxRatio">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="vehicleAndVesselTax"
					        :label="tablenav[4]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.vehicleAndVesselTax">{{scope.row.vehicleAndVesselTax}}</p>
					        	<p v-if="!scope.row.vehicleAndVesselTax">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="rewardRatio"
					        :label="tablenav[5]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.rewardRatio">{{scope.row.rewardRatio | numFilter}}%</p>
					        	<p v-if="!scope.row.rewardRatio">-</p>
					        </template>
					      </el-table-column>
					      
					      <el-table-column
					        prop="reward"
					        :label="tablenav[6]">
					        <template slot-scope="scope">
					        	<p v-if="scope.row.reward">{{scope.row.reward}}</p>
					        	<p v-if="!scope.row.reward">-</p>
					        </template>
					      </el-table-column>
					      
					    </el-table>
					</template>
		       	</div>
		       	
		       	<!--下一步-->
		       	<el-form-item class='btn-item'>
				    <el-button type="primary" class="submitBtn" :disabled="iscannext" :loading='isloading' @click="toNext('formLabel')" size="small">下一步</el-button>
					<div class='hisTable' style="    margin-left: -100px; margin-top:15px;">
						   <!-- 结算未完成历史 -->
						<a class="links" style="text-decoration: underline;" @click="getHis(1)">未完成结算历史...</a>

						<el-dialog title="未完成结算历史" :visible.sync="jiesuanHis" width='52%'>
						<el-table :data="gridData" v-loading="hisLoading" >
							<el-table-column  label="保险公司" width="110">
								<template slot-scope='scope'>
									<span v-if="scope.row.insruanceName">{{scope.row.insruanceName}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column>
							<el-table-column label="发起结算时间" width="170">
								<template slot-scope='scope'>
									<span v-if="scope.row.creationTime">{{scope.row.creationTime}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column>
							<el-table-column  label="结算周期" >
								<template slot-scope='scope'>
									<span v-if="scope.row.settlementBeginDate&&scope.row.settlementEndDate">{{scope.row.settlementBeginDate | dateFil}} 至 {{scope.row.settlementEndDate | dateFil}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column>
							
							<!-- <el-table-column label="全部" width="110">
								<template slot-scope='scope'>
									<span v-if="scope.row.totalCount">{{scope.row.totalCount}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column>
							<el-table-column  label="可以结算" width="110">
								<template slot-scope='scope'>
									<span v-if="scope.row.normalCount">{{scope.row.normalCount}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column>
							<el-table-column  label="暂不结算" width="110">
								<template slot-scope='scope'>
									<span v-if="scope.row.notnormalCount">{{scope.row.notnormalCount}}</span>
									<span v-else>-</span>
								</template>
							</el-table-column> -->
							<el-table-column  width="120" label="操作">
								<template slot-scope='scope'>
									<a class="remark acolor"  @click="jiesuan(scope.row.id)">继续结算</a>
									<a class="remark acolor" style="color: rgb(207, 19, 34);margin-left: 10px;"  @click="hisDelete(scope.row.id)" :loading="loading_delete">删除</a>
								</template>
							</el-table-column>
						</el-table>
						  <div class='page-right'>
								<el-pagination  @current-change="historyCurrentChange" :current-page='historycurrentPage' background :page-size="5" layout="total,prev, pager, next,jumper" :total="historypagetotal" class='util-page' size='mini'></el-pagination>

							</div>
						</el-dialog>
					</div>
				</el-form-item>
		       	

				
			</el-form>
			
			
			<!--模板dialog-->
			<el-dialog title="配置模板" :visible.sync="dialogTableVisible" class="demo_dia" :close-on-click-modal="false">
			  <div  class="demo_dialog">
			  	<!--<p class="demo_in">保险公司 <span>T-太平</span></p>-->
			  	<ul class="dialogUl">
			  		<li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;智保客名称</li>
			  		<!--<li>保险公司表格列名&nbsp;&nbsp;<i class="el-icon-warning orangeColor cursor" title="保险公司所给报表对应的列名，如手续费比例"></i></li>
			  		<li>保险公司表格列号&nbsp;&nbsp;<i class="el-icon-warning orangeColor cursor"  title="保险公司所给报表对应的列号，如AB"></i></li>-->
			  		<li>
			  			保险公司表格列名&nbsp;&nbsp;
			  			<el-tooltip class="item title ddd" effect="light" content="保险公司所给报表对应的列名，如手续费比例" placement="bottom">
					      <i class="el-icon-warning orangeColor cursor"></i>
					    </el-tooltip>
			  		</li>
			  		<li>
			  			保险公司表格列号&nbsp;&nbsp;
			  			<el-tooltip class="item title" effect="light" content="保险公司所给报表对应的列号，如AB" placement="bottom-end">
					      <i class="el-icon-warning orangeColor cursor"></i>
					    </el-tooltip>
			  		</li>
			  	</ul>
			  	<el-form class="upsettle-form2 demo-ruleForm">
			  		<div v-for="item in diaList">
					<!-- <span>{{item}}</span> -->
			  		<!--保单号-->
			  		<el-form-item v-if="item.displayName==='保单号'" :label="item.displayName"  class="is-required" prop="columnName">
		       			<div class="formInputWp">
		       				<el-input :class="form2Input" size="mini" :value="item.columnName" name="columnName" v-model="item.columnName" @blur="blurDemo(item.columnName)"></el-input>
		       			</div>
		       			<div class="formInputWp">
		       				<el-input :class="form2Input2" size="mini" :value="item.columnCode" name="columnCode" v-model="item.columnCode" @blur="blurDemo2(item.columnCode)"></el-input>
		       			</div>
		       		</el-form-item>
		       		<!--手续费比例-->
		       		<el-form-item v-else-if="item.displayName==='手续费比例'" :label="item.displayName"  class="is-required">
		       			<div class="formInputWp">
		       				<el-input :class="form2Input3" size="mini" :value="item.columnName | numFilter" name="columnName" v-model="item.columnName" @blur="blurDemo3(item.columnName)"></el-input>
		       			</div>
		       			<div class="formInputWp">
		       				<el-input :class="form2Input4" size="mini"  :value="item.columnCode | numFilter" name="columnCode" v-model="item.columnCode" @blur="blurDemo4(item.columnCode)"></el-input>
		       			</div>
		       		</el-form-item>
		       		<!--手续费-->
		       		<el-form-item v-else-if="item.displayName==='手续费'" :label="item.displayName"  class="is-required">
		       			<div class="formInputWp">
		       				
		       				<el-input :class="form2Input5" size="mini" :value="item.columnName" name="columnName" v-model="item.columnName" @blur="blurDemo5(item.columnName)"></el-input>
		       			</div>
		       			<div class="formInputWp">
		       				<el-input :class="form2Input6" size="mini" :value="item.columnCode" name="columnCode" v-model="item.columnCode" @blur="blurDemo6(item.columnCode)"></el-input>
		       			</div>
		       		</el-form-item>
		       		<!--。。。-->
		       		<el-form-item v-else :label="item.displayName"  class="">
		       			<div class="formInputWp">
		       				<el-input class="form2Input" size="mini" :value="item.columnName" name="columnName" v-model="item.columnName"></el-input>
		       			</div>
		       			<div class="formInputWp">
		       				<el-input class="form2Input" size="mini" :value="item.columnCode" name="columnCode" v-model="item.columnCode"></el-input>
		       			</div>
		       		</el-form-item>
		       		</div>
		       		<!--<p class="zhu">注：如保险公司给出的表格中没有此项目，请填写无</p>-->
			  		<!--保存-->
			       	<el-form-item class="last_border">
					    <el-button type="primary" class="saveBtn" @click="toSaveDemo" size="small">保存</el-button>
					</el-form-item>
			  	</el-form>
			  	
			  </div>
			  
			</el-dialog>
			
		</div>
	</div>
</template>
<script>
	import Vue from 'vue'
	import { getToken, removeToken } from '@/utils/auth'
	export default{
		data(){
			return{

				// 历史账单列表
				historycurrentPage:1,
				historypagetotal:null,
				loading_delete:false,
				 gridData: [],
				isshow:false,
				hisLoading:false,
				jiesuanHis:false,
				form2Input:'form2Input',
				form2Input2:'form2Input',
				form2Input3:'form2Input',
				form2Input4:'form2Input',
				form2Input5:'form2Input',
				form2Input6:'form2Input',
				red:'red',
				isloading: false,
				value:null,
				reamrak:'',
				formLabel:{
					insuranceId:'',
					value:'',
					reamrak:'',
					filePath:''
				},
				rules:{
					insuranceId: [{
						required: true,
						message: '请选择保险公司',
						trigger: 'change'
					}],
					value: [{
						required: true,
						message: '请选择结算周期',
						trigger: 'change'
					}],
					filePath:[{
						required: true,
						message: '请导入文件',
						trigger: 'change'
					}]
				},
				diaForm:[],
				mubanLen:null,
				diaList:[],
				diaList2:[{
					id: "",
					displayName: "保单号", 
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "手续费比例", 
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "手续费", 
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "车船税手续费比例", 
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "车船税手续费", 
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "奖励比例",
					columnName: "", 
					columnCode: ""
				},{
					id: "",
					displayName: "奖励金额",
					columnName: "", 
					columnCode: ""
				}],//模板信息
				dialogTableVisible:false,//配置模板的dialog是否显示
				companies:[],
				redtxtShow:false,//模板提示红字是否显示,
				upbtndisabled:true,//上传文件是否可用
				btndisabled:true,//下一步按钮是否禁用
				savedisabled:true,
				tableData:[],//预览列表数据
				lookedTableShow:false,//预览表格是否显示
				fileList:[],
				action:'',
				excelName:'',//导入的文件名字,
				filePath:'',
				getDay:'',
				timetype:'',//类型
				tipsshow:false,
				iscannext:true,
				tablenav:[],
				  pickerOptions: {
					shortcuts: [
					{
						text: "本周",
						onClick(picker) {
						const end = new Date();
						const start = new Date();
						var day = new Date();
						var num = day.getDay()-1;
						start.setTime(day.setDate(day.getDate() - num)); //本周第一天
						end.setTime(day.setDate(day.getDate() + 6));//本周最后一天
						picker.$emit("pick", [start, end]);
						}
					},
					{
						text: "上周",
						onClick(picker) {
						const end = new Date();
						const start = new Date();
						var day = new Date();
						var num = day.getDay()-1+7;
						start.setTime(day.setDate(day.getDate() - num)); //上周第一天
						end.setTime(day.setDate(day.getDate() + 6));//上周最后一天
						picker.$emit("pick", [start, end]);
						}
					},
					{
						text: "本月",
						onClick(picker) {
						const end = new Date();
						const start = new Date();
						var day = new Date();
						start.setTime(day.setDate(1));//本月第一天
						day.setMonth(day.getMonth()+1);//下个月
						end.setTime(day.setDate(day.getDate() - 1));//下个月第一天减1得到本月最后一天
						picker.$emit("pick", [start, end]);
						}
					},
					{
						text: "上月",
						onClick(picker) {
						const end = new Date();
						const start = new Date();
						var day = new Date();
						day.setMonth(day.getMonth()-1)
						start.setTime(day.setDate(1));//上月第一天
						day.setMonth(day.getMonth()+1);//下个月
						end.setTime(day.setDate(day.getDate() - 1));//下个月第一天减1得到本月最后一天
						picker.$emit("pick", [start, end]);
						}
					}
					]
				}, //快捷选项
			}
		},
		computed:{
		    headers(){
		      return {
		        'Authorization':'Bearer ' + getToken()
		      }
		    }
		},
		
		mounted(){
			
			console.log('999');
			this.getCompanies();
			//this.getDateChange();
		},
		filters:{
			numFilter(val) {
		    // 截取当前数据到小数点后两位
		    // let realVal = Number(val).toFixed(2)
		    // num.toFixed(2)获取的是字符串
			// return Number(realVal)
			var val = val*100
		    if(val || val == 0){
		    	val = val.toString().replace(/\$|\,/g,'');
			    if(isNaN(val)) {
			      val = "0";  
			    }
			    let sign = (val == (val = Math.abs(val)));
			    val = Math.floor(val*100+0.50000000001);
			    let cents = val%100;
			    val = Math.floor(val/100).toString();
			    if(cents<10) {
			       cents = "0" + cents
			    }
			    for (var i = 0; i < Math.floor((val.length-(1+i))/3); i++) {
			        val = val.substring(0,val.length-(4*i+3))+',' + val.substring(val.length-(4*i+3));
			    }

			    return (((sign)?'':'-') + val + '.' + cents);
		    }
		  },
		  dateFil(val){
			//   console.log(val.substring(0,10))
			  var val = val.substring(0,10)
			  return val
		  }
		},
		watch:{
						
		},
		methods:{
			gopidan(){
				this.$router.push({
					name:"upperendorsement1"
				})
			},

			getHis(val){
				console.log(val)
				this.jiesuanHis = true
				this.hisLoading = true
				const params = {
					pageIndex:val,
					pageSize:5
				}
				this.post(params, 'services/app/settle/GuaranteeSlipTempBatchsList').then(rs => {
					
		        console.log(rs)
		        if (rs.success) {
					this.hisLoading = false
					this.gridData = rs.result.items
					this.historypagetotal = rs.result.totalCount
		        }
		      })

			},
			historyCurrentChange(val){
				console.log(val)
				this.getHis(val)
			},
			//获取保险公司
		    getCompanies() {
		      const that = this
		      const params = {}
		      this.post(params, 'services/app/common/GetGroupInsurances').then(rs => {
		        console.log(rs)
		        if (rs.success) {
		          that.companies = rs.result.items
		        }
		      })
			},
			//限制上传一个文件
    		handleExceed(files, fileList) {
              this.$message.warning(`当前限制上传1个文件`);
            },
		    //时间控件
		    getDateChange(){
		  		var changeDate = new Date();
		  		var changeYear = changeDate.getFullYear();
		  		var changeMonth = (changeDate.getMonth()+1) <10 ? '0'+(changeDate.getMonth()+1):changeDate.getMonth()+1;
		  		var changeDay = changeDate.getDate();
		  		console.log(changeYear + '-' + changeMonth + '-' + changeDay);
		  		this.getDay = changeYear + '-' + changeMonth + '-' + changeDay;
		  	},
		  	//选择保险公司后判断是否配置模板
		  	changeIns(val){
				 this.getdatetype(val)
		  		let params = {
		  			id:val
		  		}
		  		this.action = process.env.BASE_DOWN+'/api/services/UploadFileSettlements/?InsuranceId=' + val;
		  		this.post(params,'services/app/settle/GetTemplate').then(res=>{
		  			if (res.success) {
						  this.mubanLen = res.result.items.length;
						  console.log(this.mubanLen)
		  				if(this.mubanLen>0 ){
							  this.diaList = res.result.items
							  console.log(this.diaList)
		  					this.upbtndisabled=false;
		  				} else{
		  					//this.diaList2 = res.result.items;
							  this.diaList = this.diaList2;
							  console.log(this.diaList)
		  					this.upbtndisabled=true
						  }
						//   console.log(this.diaList)
		
		  			}
		  		})
		  		this.$refs.uploadexcel.onRemove()
		  		this.$refs.uploadexcel.clearFiles()
			  },
			  //获取什么日期
			getdatetype(val) {
				const me = this;
				let params = {
					insuranceId: val
				};
				this.post(params, "services/app/policy/GetMatchDateHistoryBatchList").then(res => {
					if(res.success) {
						this.timetype = res.result.matchDate;
						this.tipsshow = true;
					} else {
						this.$notify.error({
							title: '错误',
							message: res.error.message
						});
					}

				});

			},
		  	//去配置模板
		  	demoedit(){
		  		this.dialogTableVisible=true
		  	},
		  	blurDemo(val){
		  		if (val=='') {
		  			this.form2Input = 'form2Inputred'
		  		}else{
		  			this.form2Input = 'form2Input'
		  		}
		  	},
		  	blurDemo2(val){
		  		if (val=='') {
		  			this.form2Input2 = 'form2Inputred'
		  		}else{
		  			this.form2Input2 = 'form2Input'
		  		}
		  	},
		  	blurDemo3(val){
		  		if (val=='') {
		  			this.form2Input3 = 'form2Inputred'
		  		}else{
		  			this.form2Input3 = 'form2Input'
		  		}
		  	},
		  	blurDemo4(val){
		  		if (val=='') {
		  			this.form2Input4 = 'form2Inputred'
		  		}else{
		  			this.form2Input4 = 'form2Input'
		  		}
		  	},
		  	blurDemo5(val){
		  		if (val=='') {
		  			this.form2Input5 = 'form2Inputred'
		  		}else{
		  			this.form2Input5 = 'form2Input'
		  		}
		  	},
		  	blurDemo6(val){
		  		if (val=='') {
		  			this.form2Input6 = 'form2Inputred'
		  		}else{
		  			this.form2Input6 = 'form2Input'
		  		}
		  	},
		  	//保存模板
		  	toSaveDemo(){
		  		
		  		if (this.diaList[0].columnName=='') {
		  			this.form2Input = 'form2Inputred'
		  		}
		  		if (this.diaList[0].columnCode=='') {
		  			this.form2Input2 = 'form2Inputred'
		  		}
		  		if (this.diaList[1].columnName=='') {
  					this.form2Input3 = 'form2Inputred'
  				}
		  		if (this.diaList[1].columnCode=='') {
					this.form2Input4 = 'form2Inputred'
				}
		  		if (this.diaList[2].columnName=='') {
					this.form2Input5 = 'form2Inputred'
				}
		  		if (this.diaList[2].columnCode=='') {
					this.form2Input6 = 'form2Inputred'
				}
		  		if(this.diaList[0].columnName!=''&&this.diaList[0].columnCode!=''&&this.diaList[1].columnName!=''&&this.diaList[1].columnCode!=''&&this.diaList[2].columnName!=''&&this.diaList[2].columnCode!=''){
		  			
		  			let params = {
			  			items:this.diaList
			  		}
			  		this.post(params,'services/app/settle/SetTemplate').then(res=>{
			  			if (res.success) {
			  				this.dialogTableVisible=false;
			  				this.upbtndisabled=false;
			  				//this.succeeNot(1);
			  			}else{
			  				this.failNot(res.error.message)
			  			}
			  		})
		  		}
		  		
		  		
		  	},
		  	//导入
		  	handleCurrentChange(val) {
		      this.fillDate(val);
		    },
		
		    loadSuc(val) {
		    	console.log("successsssssssssssssssss")
			console.log(val)
		      if (val.state == 1) {
				this.$alert(val.errorMessage, '提示', {
		          confirmButtonText: '确定',
		          type: 'warning'
		        }).then(() => {
		          
		        })
		        this.$refs.uploadexcel.clearFiles()
				return;
		      }
		      
		    this.isshow=true
		      this.iscannext=false
		      this.formLabel.filePath = val.filePath;
		      this.tableData =val.items.slice(0,5);
		      this.tablenav=val.headers
			  // this.tableData.push(val.items[0]);
			  // this.tableData.push(val.items[1]);
			  // this.tableData.push(val.items[2]);
			  // this.tableData.push(val.items[3]);
			  // this.tableData.push(val.items[4]);
			  this.lookedTableShow = true;
			  if (this.value!=null) {
			  	this.btndisabled = false;
			  } else{
			  	this.btndisabled = true;
			  }
		      
		    },
		    open4() {
		      this.$message.error("上传失败");
		    },
		    error() {
		      this.open4();
		    },
		    beforeAvatarUpload(file) {
			
		      let testmsg = file.name.substring(file.name.lastIndexOf(".") + 1);
		      const isexcel = testmsg === "xls";
		      const excel = testmsg === "xlsx";
		      console.log(file);
		      if (!isexcel && !excel) {
		        this.$confirm("上传文件暂时只支持xlsx和xls格式", "提示", {
		          confirmButtonText: "确定",
		          cancelButtonText: "取消",
		          type: "error",
		          callback: action  => {
		
		            this.$emit("closeEditUpload");
		          }
		        });
		      }
		      this.excelName = file.name;
		      return isexcel || excel;
		    },
		    handleRemove(file,filelist){
		    	this.formLabel.filePath = '';
		    	this.lookedTableShow = false;
		    	this.isshow=false
		    	
		    },
		    
		    //下一步
		    toNext(formName){
		    	this.$refs[formName].validate((valid) => {
		    		let date = this.formLabel.value;
			            let startDate,endDate;
			                startDate =date[0];
			                endDate=date[1]
				    	let params = {
				    		insuranceId:this.formLabel.insuranceId,
				    		settlementBeginDate:startDate,
				    		settlementsEndDate:endDate,
				    		reamrak:this.formLabel.reamrak,
				    		filePath:this.formLabel.filePath
				    	}
				    	
				    	console.log(params)
		    		if(valid){
		    			let date = this.formLabel.value;
		    			this.isloading=true;
			            let startDate,endDate;
			                startDate =date[0];
			                endDate=date[1]
				    	let params = {
				    		insuranceId:this.formLabel.insuranceId,
				    		settlementBeginDate:startDate,
				    		settlementsEndDate:endDate,
				    		reamrak:this.formLabel.reamrak,
				    		filePath:this.formLabel.filePath
				    	}
				    	
				    	console.log(params)
				    	this.post(params,'services/app/settle/CreateUpperSettlement').then(res=>{
				    		if (res.success) {
								this.isloading=false;
								console.log(res)
				    			this.$router.push({
									name: "uppersettle2",
									
									query: {
										id: res.result
									}
								})
				    		}else{
				    			this.isloading=false;
				    			this.failNot(res.error.message);
				    		}
				    	})
		    		} else {
						console.log(235)
						return false;
					}
		    	})	    	
		    },  
		    //保存成功提示
		    succeeNot(what){
		    	var txt = '';
		    	if (what==1) {
		    		txt='模板保存成功'
		    	} else{
		    		txt=''
		    	}
		    	const h = this.$createElement;
		      	this.$notify({
		          title: '成功',
		          message: txt,
		          type: 'success',
		          customClass:"el-notification-success"
		        });
		    },
		    //保存失败提示
		    failNot(message){
		    	console.log(message)
		    	const h = this.$createElement;
		      	this.$notify.error({
		          title: '错误',
		          message: message,
		          //duration: 0,
		          customClass:"el-notification-error"
		        });
			},
			jiesuan:function(id){
				console.log('jiesuan')
				this.$router.push({
					name: "uppersettle2",
					
					query: {
						id: id
					}
				})
			},
			hisDelete:function(id){
				console.log('hisDelete')
					this.$confirm('确认删除吗?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.loading_delete = true
						const params = {
							id:id
						}
						this.post(params, 'services/app/settle/DeleteGuaranteeSlipTempBatchs').then(rs => {
							
						console.log(rs)
						if (rs.success) {
							this.$message({
								type: 'success',
								message: '删除成功'
							});
							this.loading_delete = false,
							this.getHis(this.historycurrentPage)

						}
					})
					console.log(id)
					this.loading_delete = false
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
		    
		    
		}
	}
</script>

<style  lang="scss" scoped>
.hisTable{
	.el-table__empty-block{
		max-height: 350px;
	}
}
.acolor{color: #027dca;}
 .page-right{
        text-align: right;
        margin-top: 30px;
    }
.navnum{margin-top: 55px;padding: 0 20px;margin-bottom: 50px;}
.el-steps--simple{padding: 17px 8%;}
.el-form{
	.form_top{
		width:550px;
		margin: 0 auto;
	}
	.input_wp{
		margin-bottom: 4px;
		
	}
	.modeP,.modeP_txt{display: inline-block;}
	.modeP_txt{margin-left: 106px;color: #CF1322;;margin-top: -6px;margin-bottom: 0;}
	.wd300{width: 300px;}
	.hei28{height: 28px;line-height: 28px;padding: 0;margin: 0;color: #666;
		letter-spacing: 0;font-size: 12px;
		.acolor{color: #027dca;}
		.acolor:hover{text-decoration: underline;}
		.iconColor{color: #FF9430;cursor: pointer;}
	}
	.uploadTxt{display: inline-block;position: relative;top: -10px;margin-left: 20px;color: #666666;font-size: 13px;}
	.floatLeft{float: left;display: block;}
	.submitBtn{margin: 0 auto;margin-left: -100px;}
	.btn-item{margin-top: 100px;margin-bottom: 246px !important;text-align: center;}
	
	/*table样式*/
	.tableDiv{
		padding: 0 20px;
		table{width: 100%;}
	}
	
}
.fontsize12{font-size: 12px;}
.demowp{/*margin-top: -22px;*/position: absolute;top: 26px;}
.wd730{width:730px}
.dialogUl{
	margin: 0;padding: 0;background: #e4e4e4;overflow: hidden;height: 36px;line-height: 36px;font-size: 12px;
	li{display: block;width: 33.333%;padding: 0;box-sizing: border-box;float: left;text-align: center;font-size: 13px;}
}
.formInputWp{
	display: block;float: left;width: 33.333%;
	.form2Input{width: 90%;margin: 0 auto;}
}
.orangeColor{color: #FF9430;}
.demo_dialog{}
.demo_in{
	color: #999999;margin-top: 0;font-size: 13px;
	span{color: #333333;}
}
.zhu{color: #CF1322;font-size: 12px;}
.last_border{border-bottom: 0;}
.sysTable{height: 40px;line-height: 40px;background: #B9DBF0;}
.list-table th{font-weight: 100;color: #333333;font-size: 13px;text-align: left;padding-left: 30px;box-sizing: border-box;padding-right: 10px;}
.tableDiv_upset1{padding: 0 20px;}
.fileV{
	font-size: 13px;color: #666666;
	
}
.fileName{color: #151515;}
	.fileVerify{color:  #CF1322;}
	.form2Inputred{width: 90%;margin: 0 auto;}	
	.cursor{cursor: pointer;}


.font13{font-size: 13px;}	
.timetips{
	color: #666;
	font-size: 12px;
}
.list-tab {
        padding: 0 20px;
        box-border: border;
        border-bottom: 1px solid #cbcbcb;
        margin-top:20px;
        margin-bottom:30px;
        .tab {
          display: inline-block;
          padding: 0 10px;
          line-height: 40px;
          text-align: center;
          color: #333;
          cursor: pointer;
          margin-bottom: -1px;
          span {
            color: #999;
          }
        }
        .now {
          color: #ff7819 !important;
          background: url(../../../assets/images/bomactive2x.png) center 32px
            no-repeat;
          span {
            color: #ff7819 !important;
          }
        }
      }
</style>
<style>
	.el-step__head.is-curt,.el-step__title.is-curt{color: #c0c4cc;}
	.upsettle-form1 .el-form-item__label{color: #333333 !important;}
	.demo_dia .el-dialog{width: 534px;}
	.el-dialog .el-form-item__label{width: 33.333%;padding-right: 30px;}
	.upsettle-form2 .el-form-item{padding: 10px 0;border-bottom: 1px solid #e4e4e4;margin-bottom: 0;}
	.demo_dia .el-dialog__body{padding-top: 20px;}
	.upsettle-form2 .el-form-item.last_border{border-bottom: 0;text-align: center;}
	.tableDiv_upset1 .el-table.lookedTable table th{background: #FCF0E4;}
	.tableDiv_upset1 .el-table table th .cell{font-size: 13px;color: #333333;}
	.tableDiv_upset1 .el-table.sysTable table th{background: #B9DBF0;}
	/*.tableDiv_upset1 .el-table.sysTable table th .cell{font-size: 13px;color: #333333;}*/
	.tableDiv_upset1 .el-table td,.tableDiv_upset1 .el-table th{padding: 0;line-height: 40px;height: 40px;}

	.form2Inputred .el-input__inner{border: 1px solid red !important;}
	/*.el-tooltip__popper.is-light{background: red !important;height: 28px;line-height: 28px;padding: 0;}*/
	.excelWp .el-form-item__error{margin-top: -15px;}
	 
</style>